<html>
<head>
	<style type="text/css">
.mini-owl {
  width: 250px;
  height: 270px;
  background-color: #f2b22e;
  border-radius: 60% 60% 70% 70%; 
  position: absolute;
  left: 50%;
  margin-left: -105px;
  top: 3rem;
}

.mini-owl:before, .mini-owl:after {
  content: "";
  display: block;
  position: absolute;
  width: 0;
  height: 0;
  border-top: 15px solid transparent;
  border-left: 90px solid #FF0000;
  border-bottom: 50px solid transparent;
  border-radius: 10% 0 0 0;
  z-index:-10;
}

.mini-owl:before {
  left: 90px;
  top: -25px;
  -webkit-transform: rotate(10deg);
  transform: rotate(30deg);
}

.mini-owl:after {
  -webkit-transform: rotate(-110deg) scale(-1);
  transform: rotate(-130deg) scale(-1);
  right: 50px;
  top: -6px;
}
.eye {
  position: absolute;
  width: 80px;
  height: 80px;
  border-radius: 50%;
  z-index: 9999;
  top: 45px;
}

.eye:after {
  content: "";
  background: black;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -20px;
}

.left-eye {
  left: 30px;
}

.right-eye {
  right: 30px;
}

.beak {
  position: absolute;
  left: 50px;
  top: 104px;
  width: 0;
	height: 0;
	border-left: 75px solid transparent;
	border-right: 75px solid transparent;
	border-top: 90px solid #FF0000;
  -webkit-transform: scale(.25);
  transform: scale(.25);
}

.wings {
  position: absolute;
  height: 100px;
  width: 40px;
  background: #f2b22e;
  border-radius: 50%;
  z-index: -1;
  top: 90px;
}

.left-wing {
  -webkit-transform: rotate(50deg);
  transform: rotate(50deg);
  left: -5px;
}

.right-wing {
  -webkit-transform: rotate(-50deg);
  transform: rotate(-50deg);
  right: -5px;
}

.left-foot, .right-foot {
  position: absolute;
  bottom: 1px;
  height: 25px;
  width: 12px;
  background-color: #e27326;
  border-radius: 50%;
}

.left-foot {
  left: 45px;
}
.right-foot {
  right: 45px;
}

.left-foot:before, .right-foot:before, 
.left-foot:after, .right-foot:after {
  content: '';
  position: absolute;
  border-radius: 50%;
  background: #e27326;
  width: 12px;
}

.left-foot:before, 
.right-foot:before {
  left: -8px;
}
.left-foot:after, 
.right-foot:after {
  right: -8px;
}
.left-foot:before, 
.right-foot:after {
  bottom: 8px;
  height: 24px;
}
.left-foot:after, 
.right-foot:before {
  bottom: 0px;
  height: 20px;
}

	</style>
</head>
<body>
	<div class="mini-owl">
	  <div class="body">
	    <div class="eye left-eye"></div>
	    <div class="eye right-eye"></div>
	    <div class="beak"></div>
	  </div> 
	  <div class="wings left-wing"></div>
	  <div class="wings right-wing"></div>
	  
	  <div class="left-foot"></div>
	  <div class="right-foot"></div> 
	</div>
</body>
</html>